
//需求 获取值跟修改都变的简单
// const [userInfo,setUserInfo] = UseStorage()

// setUserInfo({name:'xxx',password:132})
import React,{ useState } from 'react';
export function useStorage(key){
  let initValue = localStorage.getItem(key)// '{}','[{}]','hello'

  //try..catch 代码错误也会往下跑
  try{
    initValue = JSON.parse(initValue)//当时字符串的时候会报错，但是value还是原来的值
  }catch(err){

  }
  const [value, setValue] = useState(initValue);

  const changeValue = function (newValue){
     // 如果newValue为对象，需要转成json
    if(typeof newValue === 'object'){
      localStorage.setItem(key,JSON.stringify(newValue))
    }else{
      localStorage.setItem(key, newValue)
    }
    setValue(newValue)

  }

  return[//返回一个数值，得到数据，跟修改后的值
    value,
    changeValue
  ]

}

// let userInfo = localStorage.get('userInfo')  //获取到的是字符串

// try{//用户传入的值有可能不是json字符串，所以用try...catch不影响后面代码的执行
//   userInfo = JSON.parse(userInfo) ||  {}//将字符串转成json的格式才能存入存储, 
// }catch(err){
//   userInfo = {}
// }
// //最终的结果不是json字符串就是 {}

// localStorage.setItem('userInfo',JSON.stringify(userInfo))//如果需要修改又要重新进行转换json步骤繁琐